<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        // 构造函数
        function Person(name, age) {
            this.name = name;
            this.age = age;
        }
        let p1 = new Person('tom', 10);
        // 往原型对象上添加数据或者方法
        Person.prototype.jump = function () {
            console.log('3米');
        }
        console.log(p1)
        p1.jump();

        // class类构造函数的语法糖
        class PersonClass {
            // 构造器
            constructor(name, age) {
                this.name = name;
                this.age = age;
                this.hi = function () {
                    console.log(this);
                }
            };
            // 添加到PersonClass的静态属性和方法
            static sex = '男';
            static song() {
                console.log('一滴泪的世界')
            };
            // 在所有实例对象上添加的属性
            hobby = '性别男爱好女';
            // 往原型对象上添加方法
            jump() {
                console.log('这是class类往原型对象上添加方法');
                console.log(this);
            }
        }
        let classp1 = new PersonClass('jack', 10);
        console.log(classp1);
        classp1.jump();
        console.dir(PersonClass);
        classp1.hi();

        // 继承
        class Son extends PersonClass {
            constructor(name, age) {
                super(name, age)
            }
            static song_son() {
                // 当super以对象调用时，在子类的静态方法中可以继承父类的静态方法
                super.song();
            }
            jump_son() {
                // 当super以对象调用时，在子类的原型方法中可以继承父类的原型方法
                super.jump();
            }
        }
        let son1 = new Son('rose', 10);
        console.log(son1);
        console.dir(Son);
        Son.song_son();
        son1.jump_son();
    </script>
</body>

</html>